<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" />
	<script>
        var html = document.getElementsByTagName('html')[0];
        html.style.fontSize = html.clientWidth / 3.75 + "px";
    </script>
	<title>新增地址</title>
	<link rel="stylesheet" href="../static/css/Reset.css" />
	<link rel="stylesheet" href="../static/css/addAddress.css" />
</head>
<body>
	<div class="container" id="addAddress">
		<form id="address_form">
			<div class="from_group">
				<div class="item">
					<span>联系人</span><input type="text" id="people" name="people" value="" />
				</div>
				<div class="item">
					<span>联系电话</span><input type="tel" id="mobile" name="mobile" value="" />
				</div>
				<div class="item" v-on:click="getProvince()">
					<a id="expressArea" href="javascript:void(0)">
					<span>地区信息</span>
					<input type="text" id="address" name="address" value="" readonly="readonly" placeholder="省 > 市 > 区/县"/>
					<input type="hidden" name="pcdId" id="pcdId" value="" />
					</a>
				</div>
				<div class="item">
					<span>详细地址</span><input type="text" id="area" name="area" value="" />
				</div>
				<div class="item">
					<span>邮政编码</span><input type="text" id="isZipCode" name="isZipCode" value="" />
				</div>
			</div>
			<button type="submit" class="submit" >保存</button>
			<!--<div class="submit" v-on:click="saveAddrUrl()">保存</div>-->
		</form>
		<!--选择地区弹层-->
		<section id="areaLayer" class="express-area-box">
		    <header>
		        <h3>选择地区</h3>
		        <a v-show="isCity" v-on:click="getProvince()" id="backUp" class="back" href="javascript:void(0)" title="返回"></a>
		        <a v-show="isCout" v-on:click="getCity($event)" id="" class="back backCity" href="javascript:void(0)" title="返回"></a>
		        <a id="closeArea" class="close" href="javascript:void(0)" title="关闭"></a>
		    </header>
		    <article id="areaBox">
		        <ul id="areaList" class="area-list" v-cloak>
		        	<li v-show="isProv" v-for="prov in provinceData" v-bind:id="prov.id" v-on:click="getCity($event)">{{prov.name}}</li>
		        	<li v-show="isCity" v-for="city in cityData" v-bind:id="city.id" v-on:click="getCounty($event)">{{city.name}}</li>
		        	<li v-show="isCout" v-for="coun in countyData" v-bind:id="coun.id" v-on:click="overArea($event)">{{coun.name}}</li>
		        </ul>
		    </article>
		</section>
		<!--遮罩层-->
		<div id="areaMask" class="mask"></div>
	</div>
</body>
<!--<script src="https://api.map.baidu.com/api?v=2.0&ak=HuWMDRmExUdhWoXsVSnBgqdvtWzhgfDY&s=1"></script>-->
<script type="text/javascript" src="../libs/jquery.min.js"></script>
<script type="text/javascript" src="../libs/jquery.validate.min.js"></script>
<script type="text/javascript" src="../libs/fastclick.min.js"></script>
<script type="text/javascript" src="../libs/vue/vue.min.js"></script>
<script type="text/javascript" src="../libs/vue/vue-resource.min.js"></script>
<script type="text/javascript" src="../libs/require.js"></script>
<script type="text/javascript" src="../libs/var.js"></script>
<script type="text/javascript" src="../libs/common.js"></script>
<script type="text/javascript" src="./js/addAddress.js"></script>
</html>